import React,{Suspense} from 'react'
import {ROUTESTYPE,HOMEPATHTYPE} from "../types/router.d"
import routes from './routerConfig'
import {BrowserRouter,Route,Routes,Navigate} from "react-router-dom"
function routerViews() {
  const renderRouter=(routes:ROUTESTYPE[])=>{
    return routes.map((item,index)=>{
      return <Route key={index} path={item.path} element={item.to?<Navigate to={item.to}/>:<item.component/>}>
        {
          item.children&&renderRouter(item.children)
        }
      </Route>
    })
  }
  return (
    <Suspense fallback={<div>LOADING.....</div>}>
      <BrowserRouter>
      <Routes>
        {renderRouter(routes)}
      </Routes>
      </BrowserRouter>
    </Suspense>

  )
}

export default routerViews